<template>
  <div class="bg">
    <nav-com
      :title="title"
      :showView='showView'
      @back="backHandler()"
    ></nav-com>
    <div class="top-view1" v-if="Dataflag == 'pinmoney'">
      <div style="padding-top:5vw">我的总余额</div>
      <div style="font-size:7vw;margin:4vw 0">{{shareUser.price || 0}}</div>
      <div class="btn-list">
        <div
          class="btn"
          @click="clickHandle(1)"
        >到账</div>
        <div
          class="btn"
          @click="clickHandle(2)"
        >转兑</div>
        <div
          class="btn"
          @click="clickHandle(3)"
        >转让</div>
        <div
          class="btn"
          @click="clickHandle(4)"
        >充值</div>
      </div>
    </div>
    <div style="margin:5vw 0 0vw 5vw" v-if="Dataflag == 'pinmoney'">总余额记录</div>
    <van-pull-refresh
      v-model='isLoading'
      @refresh='onRefresh'
    >
      <div
        v-if="list.length==0"
        class="empty"
      >
        <img src='../../assets/t4.png'>
        <p>{{listEmpty}}</p>
      </div>
      <template v-if="Dataflag == 'fttProfit' || Dataflag == 'referralProfit' || Dataflag == 'teamProfit' || Dataflag == 'pinmoney'">
        <ul class="teamlist">
          <van-list
            v-model="loading"
            :finished="finished"
            @load="onload"
          >
            <li
              v-for="(item,index) in list"
              :key="index"
            >
              <div class="teamlist_title">{{item.addtime}}</div>
              <div class="teamlist_bottom">
                <p>{{item.type_name}}</p>
                <span>{{item.flag}} {{item.money}}</span>
              </div>
            </li>
          </van-list>
        </ul>
      </template>
    </van-pull-refresh>
  </div>
</template>
<script>
import { getAccountItems, getmoney, getuserInfo, newMoneyTip } from "@/api/api";
import navCom from "@/component/nav";
export default {
  name: "bonusList",
  components: {
    navCom,
  },
  data() {
    return {
      showView: true,
      uid: weixin.getUserId(),
      title: "",
      listEmpty: "",
      list: [],
      isLoading: false,
      loading: true,
      finished: false,
      total: 0,
      pageNo: 1,
      Dataflag: "",
      shareUser:{}
    };
  },
  mounted() {
    this.getNewMoneyTip()
    this.init();
    this.getUserData()
  },
  methods: {
    getNewMoneyTip(){
      newMoneyTip().then((result) => {
        console.log(68, result)
        if(result.data.code==1){
          this.$dialog.alert({
            title:'提示',
            message: result.data.data.content
          })
        }
      }).catch((err) => {
        
      });
    },
    clickHandle(val) {
      if (val == 1) {
        if (this.shareUser.price == 0) {
          Toast("资产不足");
          return
        }
        this.$router.push("/withdrawal");
      } else if (val == 2) {
        //余额转兑
        this.$router.push("/exchangeMoney");
      } else if (val == 3) {
        //余额转兑
        this.$router.push("/balanceToOthers");
      } else if (val == 4) {
        this.$router.push("/recharge");
      }
    },
    // 用户信息
    getUserData() {
      getuserInfo().then((res) => {
        console.log("getuserInfo", res);
        if (res.data.code == 1) {
          this.shareUser = res.data.data;
        }
      });
    },
    //返回
    backHandler() {
      if (weixin.isAndroid()) {
        window.JS_TROOPS.goBack();
      } else {
        this.$router.go(-1);
      }
    },
    //下拉刷新
    onRefresh() {
      var that = this;
      if (this.finished) {
        this.$dialog
          .alert({
            message: "加载完毕。",
          })
          .then(() => {
            this.isLoading = false;
          });
      } else {
        this.pageNo = 1;
        this.list = [];
        this.isLoading = false;
        this.init();
      }
    },
    //数据加载
    onload() {
      this.init();
    },
    //初始化
    init() {
      this.Dataflag = location.href.substring(
        location.href.indexOf("list/") + 5
      );
      if (this.Dataflag == "fttProfit") {
        this.title = "分红奖励";
      } else if (this.Dataflag == "referralProfit") {
        this.title = "分享奖励";
      } else if (this.Dataflag == "teamProfit") {
        this.title = "团队奖励";
      } else if (this.Dataflag == "pinmoney") {
        this.title = "总余额记录";
      }

      getmoney({
        offset: this.pageNo,
        limit: 10,
      }).then((res) => {
        console.log(res);
        if (res.data.code == 1) {
          //  this.pageNo++
          //  this.list = res.data.data

          let rows = res.data.data;
          if (rows.length == 0) {
            if (this.Dataflag == "fttProfit") {
              this.listEmpty = "您还没有分红奖励记录哦~";
            } else if (this.Dataflag == "referralProfit") {
              this.listEmpty = "您还没有分享奖励记录哦~";
            } else if (this.Dataflag == "teamProfit") {
              this.listEmpty = "您还没有团队奖励记录哦~";
            } else if (this.Dataflag == "pinmoney") {
              this.listEmpty = "您还没有总资产记录哦~";
            }
          }
          this.pageNo++;
          this.list = this.list.concat(rows);
          // this.total = res.data.data.total
          if (rows.length < 1) {
            this.finished = true;
            this.loading = true;
            this.end = true;
            // this.$dialog.alert({
            //     message:"没有更多了..."
            // })
          } else {
            this.finished = false;
            this.loading = false;
          }
        } else {
          this.$dialog.alert({
            message: res.data.msg,
          });
        }
      });
      // if(this.Dataflag == 'fttProfit' || this.Dataflag == 'referralProfit' || this.Dataflag == 'teamProfit' || this.Dataflag == 'pinmoney' ){
      //     this.getAccountItemsHandler()
      // }
    },
    //获取分红分享团队总资产数据
    getAccountItemsHandler() {
      getAccountItems({
        userId: this.uid,
        acctc: this.Dataflag,
        pageNo: this.pageNo,
      }).then((res) => {
        if (res.data.code == 200) {
          let rows = res.data.data.rows;
          if (rows.length == 0) {
            if (this.Dataflag == "fttProfit") {
              this.listEmpty = "您还没有分红奖励记录哦~";
            } else if (this.Dataflag == "referralProfit") {
              this.listEmpty = "您还没有分享奖励记录哦~";
            } else if (this.Dataflag == "teamProfit") {
              this.listEmpty = "您还没有团队奖励记录哦~";
            } else if (this.Dataflag == "pinmoney") {
              this.listEmpty = "您还没有总资产记录哦~";
            }
          }
          this.pageNo++;
          this.list = this.list.concat(rows);
          this.total = res.data.data.total;
          if (this.list.length < 1) {
            this.finished = true;
          } else if (this.list.length >= this.total) {
            this.finished = true;
          } else {
            this.finished = false;
            this.loading = false;
          }
        } else {
          this.$dialog.alert({
            message: res.data.msg,
          });
        }
      });
    },
  },
};
</script>
<style scoped>
.top-view1 {
  color: #fff;
  background: url("../../assets/my/allmoney.png");
  background-size: 100% 100%;
  width: 100vw;
  margin: 0;
  border: none;
  height: 18vh;
  text-align: center;
}
.top-view1 .btn-list {
  display: flex;
  justify-content: space-around;
}
.top-view1 .btn-list .btn {
  height: 8vw;
  width: 20vw;
  line-height: 8vw;
  color: #fe4b20;
  text-align: center;
  background: #fff;
  border-radius: 1vw;
}
p {
  padding: 0;
  margin: 0;
}
.bg {
  background: #f1f3f6;
  min-height: 100vh;
}
.teamlist {
  margin: 0 4vw;
  height: auto;
  overflow: hidden;
  margin-bottom: 20vw;
}
.teamlist li {
  background: #fff;
  margin-top: 4vw;
  height: auto;
  overflow: hidden;
}
.teamlist_title {
  padding-left: 4vw;
  border-radius: 1.3vw;
  border-bottom: 1px solid #e8e8e8;
  color: #999;
  height: 8vw;
  line-height: 8vw;
}
.teamlist_bottom {
  display: flex;
  justify-content: space-between;
  height: 12vw;
  line-height: 12vw;
}
.teamlist_bottom p {
  padding-left: 4vw;
  color: #333;
}
.teamlist_bottom span {
  padding-right: 4vw;
  color: #ff0000;
}
.empty {
  padding-top: 29.33vw;
  text-align: center;
}
.empty img {
  width: 54.4vw;
  height: 37.6vw;
}
.empty p {
  font-size: 3vw;
  color: #333;
  margin-top: 4vw;
}
</style>